/* Prism components - article module: breadcrumb, category chips, list rows,
   pagination, aside list and the single-article detail. Used by art/{index,type,show,detail}. */

/* breadcrumb */
.c-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:.45em;font-size:var(--fs-sm);color:var(--c-text-muted);margin-block:var(--space-md)}
.c-crumb a{color:var(--c-text-muted)}
.c-crumb a:hover{color:var(--c-accent)}
.c-crumb__sep{opacity:.45}
.c-crumb__cur{color:var(--c-text);font-weight:500}

/* category chips */
.c-cats{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-bottom:var(--space-lg)}
.c-cats__link{display:inline-flex;align-items:center;padding:.42em .95em;border-radius:var(--radius-pill);font-size:var(--fs-sm);
  background:var(--c-surface-2);border:1px solid var(--c-border);color:var(--c-text);white-space:nowrap;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.c-cats__link:hover{border-color:var(--c-accent);color:var(--c-accent)}
.c-cats__link.is-active{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-accent-ink)}

/* article list rows */
.c-artrows{container-type:inline-size;display:flex;flex-direction:column}
.c-artrow{display:flex;gap:var(--space-md);padding:var(--space-md) 0;border-bottom:1px solid var(--c-border)}
.c-artrow:first-child{padding-top:0}
.c-artrow:last-child{border-bottom:0}
.c-artrow__thumb{flex:none;width:150px;aspect-ratio:16 / 10;border-radius:var(--radius-md);overflow:hidden;background:var(--c-surface-2)}
.c-artrow__thumb img{width:100%;height:100%;object-fit:cover;transition:transform var(--dur) var(--ease)}
.c-artrow:hover .c-artrow__thumb img{transform:scale(1.05)}
.c-artrow__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.5em}
.c-artrow__title{font-size:var(--fs-lg);font-weight:600;line-height:var(--lh-tight)}
.c-artrow:hover .c-artrow__title{color:var(--c-accent)}
.c-artrow__blurb{font-size:var(--fs-sm);color:var(--c-text-muted);line-height:1.6}
.c-artrow__meta{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:.4em 1.1em;font-size:var(--fs-xs);color:var(--c-text-muted)}
.c-artrow__meta>span{display:inline-flex;align-items:center;gap:.35em}
.c-artrow__cat{color:var(--c-accent)}
@container (max-width:440px){
  .c-artrow__thumb{width:104px}
  .c-artrow__blurb{display:none}
}

/* pagination */
.c-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.4em;margin-top:var(--space-lg)}
.c-pager a,.c-pager span{display:inline-flex;align-items:center;justify-content:center;min-width:2.3em;height:2.3em;padding:0 .7em;
  border-radius:var(--radius-md);font-size:var(--fs-sm);background:var(--c-surface);border:1px solid var(--c-border);color:var(--c-text)}
.c-pager a:hover{border-color:var(--c-accent);color:var(--c-accent)}
.c-pager .is-active{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-accent-ink);font-weight:600}
.c-pager .is-disabled{opacity:.4;pointer-events:none}
.c-pager__ellipsis{border:0;background:none}

/* aside text list (recommended reading / hot) */
.c-asidelist{display:flex;flex-direction:column}
.c-asidelist__item{display:block;padding:.62em 0;border-bottom:1px solid var(--c-border);font-size:var(--fs-sm);line-height:1.45}
.c-asidelist__item:last-child{border-bottom:0}
.c-asidelist__item:hover{color:var(--c-accent)}
.c-asidelist__meta{display:block;font-size:var(--fs-xs);color:var(--c-text-muted);margin-top:.25em}

/* single-article detail */
.c-article{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-1);padding:clamp(1.25rem,3vw,2.5rem)}
.c-article__title{font-size:var(--fs-2xl);line-height:var(--lh-tight);margin-bottom:var(--space-md)}
.c-article__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5em 1.2em;font-size:var(--fs-sm);color:var(--c-text-muted);
  padding-bottom:var(--space-md);border-bottom:1px solid var(--c-border);margin-bottom:var(--space-lg)}
.c-article__meta>span{display:inline-flex;align-items:center;gap:.35em}
.c-article__meta .c-artrow__cat,.c-article__meta a{color:var(--c-accent)}
.c-article__cover{margin-bottom:var(--space-lg);border-radius:var(--radius-md);overflow:hidden;max-height:420px}
.c-article__cover img{width:100%;height:100%;object-fit:cover;display:block}
.c-article__lead{font-size:var(--fs-md);color:var(--c-text-muted);line-height:1.8;padding:var(--space-md) var(--space-lg);
  background:var(--c-surface-2);border-radius:var(--radius-md);border-left:3px solid var(--c-accent);margin-bottom:var(--space-lg)}
.c-article__content{font-size:var(--fs-md);line-height:1.9;color:var(--c-text);word-wrap:break-word;overflow-wrap:break-word}
.c-article__content p{margin-bottom:1.1em}
.c-article__content img{max-width:100%;height:auto;border-radius:var(--radius-sm);margin:1em 0}
.c-article__content h2,.c-article__content h3,.c-article__content h4{margin:1.5em 0 .6em;line-height:var(--lh-tight)}
.c-article__content a{color:var(--c-accent)}
.c-article__content ul,.c-article__content ol{margin:0 0 1.1em 1.4em}
.c-article__content ul{list-style:disc}
.c-article__content ol{list-style:decimal}
.c-article__content blockquote{border-left:3px solid var(--c-border);padding:.2em 0 .2em 1em;color:var(--c-text-muted);margin:1em 0}
.c-article__tags{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-xs);margin-top:var(--space-lg);padding-top:var(--space-lg);border-top:1px solid var(--c-border)}
.c-article__tags-label{font-size:var(--fs-sm);color:var(--c-text-muted);margin-right:.3em}
.c-article__tag{display:inline-flex;align-items:center;padding:.32em .85em;border-radius:var(--radius-pill);font-size:var(--fs-xs);
  background:var(--c-surface-2);color:var(--c-text-muted);transition:color var(--dur) var(--ease)}
.c-article__tag:hover{color:var(--c-accent)}

/* article search results (art/search) — flex order floats the post-loop
   summary bar (which needs $__PAGING__ from the loop) above the result list */
.c-search__body{display:flex;flex-direction:column}
.c-search__bar{order:-2;font-size:var(--fs-sm);color:var(--c-text-muted);margin-bottom:var(--space-sm)}
.c-search__sort{order:-1}
.c-search__sort .c-cats__link{gap:.4em}
.c-search__kw{font-style:normal;color:var(--c-accent);font-weight:600;word-break:break-word}
.c-search__total{font-style:normal;color:var(--c-accent);font-weight:600;padding:0 .15em}
.c-search__empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-lg) 0}
.c-search__tip{font-size:var(--fs-sm);color:var(--c-text-muted)}

/* article reader (art/read) — immersive long-text reader */
.c-playbar--center{justify-content:center;margin-top:var(--space-md)}
.c-artread__fontctl{display:inline-flex;gap:.3em;margin-left:auto}
.c-artread{max-width:46rem;margin:0 auto var(--space-md);background:var(--c-surface);border:1px solid var(--c-border);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-1);padding:clamp(1.25rem,4vw,2.6rem)}
.c-artread__head{margin-bottom:var(--space-lg);padding-bottom:var(--space-md);border-bottom:1px solid var(--c-border)}
.c-artread__title{font-size:var(--fs-xl);line-height:var(--lh-tight);margin-bottom:var(--space-sm)}
.c-artread__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5em 1.1em;font-size:var(--fs-xs);color:var(--c-text-muted)}
.c-artread__meta>span{display:inline-flex;align-items:center;gap:.35em}
.c-artread__content{font-size:18px;line-height:2}

/* reader permission gate */
.c-artgate{max-width:46rem;margin:0 auto var(--space-md);display:flex;flex-direction:column;align-items:center;gap:var(--space-md);
  text-align:center;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:var(--space-xl) var(--space-lg)}
.c-artgate__ico{font-size:2.8rem;color:var(--c-accent)}
.c-artgate__msg{font-size:var(--fs-md);color:var(--c-text-muted);max-width:30em}
.c-artgate__btns{display:flex;flex-wrap:wrap;gap:var(--space-sm);justify-content:center}

/* table-of-contents drawer (shared-ready: .c-toc) */
.c-toc[hidden]{display:none}
.c-toc{position:fixed;inset:0;z-index:60}
.c-toc__mask{position:absolute;inset:0;background:var(--c-overlay,rgba(0,0,0,.5))}
.c-toc__panel{position:absolute;top:0;right:0;height:100%;width:min(380px,86vw);display:flex;flex-direction:column;
  background:var(--c-surface);border-left:1px solid var(--c-border);box-shadow:var(--shadow-3);animation:toc-in var(--dur) var(--ease)}
@keyframes toc-in{from{transform:translateX(100%)}to{transform:translateX(0)}}
.c-toc__head{display:flex;align-items:center;gap:.6em;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--c-border)}
.c-toc__title{font-size:var(--fs-lg);font-weight:700}
.c-toc__count{font-size:var(--fs-xs);color:var(--c-text-muted)}
.c-toc__close{margin-left:auto;background:0;border:0;color:var(--c-text-muted);font-size:1.1em;cursor:pointer;line-height:1}
.c-toc__close:hover{color:var(--c-accent)}
.c-toc__list{flex:1;overflow-y:auto;padding:var(--space-sm) 0}
.c-toc__item{display:flex;align-items:center;gap:.7em;padding:.7em var(--space-lg);font-size:var(--fs-sm);color:var(--c-text);border-bottom:1px solid var(--c-border)}
.c-toc__item:hover{background:var(--c-surface-2);color:var(--c-accent)}
.c-toc__item.is-active{color:var(--c-accent);font-weight:600}
.c-toc__no{flex:none;min-width:1.8em;text-align:center;font-size:var(--fs-xs);color:var(--c-text-muted)}
.c-toc__item.is-active .c-toc__no{color:var(--c-accent)}
.c-toc__name{min-width:0}
